<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<title>数字化转型创意大赛决赛</title>
	<!-- import CSS -->
	<link rel="stylesheet" href="http://npm.elemecdn.com/mint-ui@2.2.13/lib/style.css">
	<link rel="stylesheet" href="/static/main.css">
</head>

<body>
	<div id="app">
		<mt-header fixed title="数字化转型创意大赛决赛">
			<mt-button icon="back" slot="left" onclick="location.href = '/'">返回</mt-button>
		</mt-header>
		<div style="margin-top:50px;">
		<mt-loadmore :top-method="loadList" ref="loadmore">
			<div style='min-height:500px;'>
			
				<mt-cell v-for="item,index in list" :title="item.id + ' ' + item.title">
				<mt-button @click="openInfo(item)" type="primary" v-if="item.statu != 2">查看</mt-button>
				<mt-button @click="openInfo(item)" type="primary" v-if="item.statu == 2">{{item.score.toFixed(2)}}分</mt-button>
			</mt-cell>
			</div>
			
		</mt-loadmore>
			
		</div>


	</div>
</body>
<!-- import Vue before Mint UI -->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<!-- import JavaScript -->
<script src="http://npm.elemecdn.com/mint-ui@2.2.13/lib/index.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue-resource@1.5.0"></script>
<script src="/static/common.js"></script>
<script>
	new Vue({
		el: '#app',
		data: {
			list: [ ]
		},
		methods: {
			openInfo: function (gradeItem) {
				this.$indicator.open();
				location.href = '/info?id=' + gradeItem.id;
			},
			loadList: function () {
				var vm = this;
				vm.$indicator.open();
				this.$http.get('/list').then(response => {
					vm.$indicator.close();
					vm.$refs.loadmore.onTopLoaded();
					if (response.body.success) {
						vm.list = response.body.data;
					}
					else {
						this.$toast(response.body.msg);
					}
				}, response => {
					this.$indicator.close();
					vm.$refs.loadmore.onTopLoaded();
					this.$toast('数据加载失败');
				});
			}
		},
		mounted: function () {
			var vm = this;
			this.$nextTick(function () {
				vm.loadList();
			})
		}
	});
</script>

</html>